<template>
  <div id="exchangeorderlist"> 


          <el-table :data="datalist" style="width: 100%" :height="dtheight" :header-cell-style="{background:'#4F81BC',color:'white'}"
           :row-class-name="tableRowClassName"  :border="true">

               
                <el-table-column label="订单时间"  align='center' width="180">                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.time }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="兑换数量"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.real_number }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="实际数量"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.number }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="兑换折扣"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.discount }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="订单状态"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                        <!-- <span v-if="scope.row.status == 'WAIT_AGREE_SELLER'">等待卖家同意兑换</span> -->
                        <span v-if="scope.row.status == 'SELLER_REFUSE_APPLY'">卖家拒绝兑换</span>
                        <span v-if="scope.row.status == 'WAIT_SUBMIT_VOUCHER'"> 待上传凭证</span>
                        <!-- <span v-if="scope.row.status == 'SUBMITTED_VOUCHER'"> 已提交凭证</span> -->
                        <span v-if="scope.row.status == 'SUBMITTED_VOUCHER'"> 待确认/上传凭证</span>
                        <span v-if="scope.row.status == 'REJECT'"> 驳回</span>
                        <span v-if="scope.row.status == 'RESUBMITTED_VOUCHER'">重新提交凭证</span>
                        <span v-if="scope.row.status == 'APPEAL_SELLER'">出让方申述</span>
                        <span v-if="scope.row.status == 'APPEAL_BUYER'">兑换方申述</span>
                        <span v-if="scope.row.status == 'CONFIRMED'">已完成</span>
                        <span v-if="scope.row.status == 'NOT_SUMBIT_IN_TEN_MINUTES'">60分钟未上传</span>
                        <span v-if="scope.row.status == 'NOT_SUMBIT_IN_TEN_MI'"> 60分钟未上传</span>
                        <span v-if="scope.row.status == 'NOT_SUMBIT_FOR_SECOND'">未二次上传</span>
                        <span v-if="scope.row.status == 'SELLER_OVERTIME'">超时自动完成</span>
                        <span v-if="scope.row.status == 'CANCELLED_BUYER'">兑换方确认申诉</span>
                        <span v-if="scope.row.status == 'CANCELLED_SELLER'">出让方确认申诉</span>
                        <span v-if="scope.row.status == 'WAIT_ADMIN_EXAMINE'">等待后台审核</span>
                        <span v-if="scope.row.status == 'ERROR_FOR_BUYER'">兑换方责任</span>
                        <span v-if="scope.row.status == 'ERROR_FOR_SELLER'">出让方责任</span>
                        <span v-if="scope.row.status == 'WAIT_AGREE_SELLER'">等待确认</span>
                    </template>
                </el-table-column>
                <el-table-column label="出让方账号"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.saler_telphone }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="出让方姓名"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.saler_nickname }}</span>
                    </template>
                </el-table-column>
                 <el-table-column label="兑换方账号"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.buyer_telphone }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="兑换方姓名"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.buyer_nickname }}</span>
                    </template>
                </el-table-column>
                <!-- <el-table-column label="出让方驳回原因"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                        <span v-if="scope.row.status == 'REJECT'">{{ scope.row.reason }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="出让方驳回凭证"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                         <span v-if="scope.row.status == 'REJECT'">
                             <el-image 
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.reason_picture" 
                                :preview-src-list="scope.row.reason_pictureList" class="imga">
                            </el-image>
                        </span>
                    </template>
                </el-table-column>
                <el-table-column label="出让方申述原因"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                        <span  v-if="scope.row.status == 'APPEAL_SELLER || ERROR_FOR_SELLER'">{{ scope.row.reason }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="出让方申述凭证"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                        <span   v-if="scope.row.status == 'APPEAL_SELLER || ERROR_FOR_SELLER'">
                             <el-image 
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.reason_picture" 
                                :preview-src-list="scope.row.reason_pictureList" class="imga">
                            </el-image>
                        </span>
                    </template>
                </el-table-column> -->
               <!-- <el-table-column label="收款码（微信）"  align='center'  width="150"  > 
                    
                    <template slot-scope="scope">      

                        <span v-if="scope.row.buy_type == 1"> 
                            <el-image  
                                v-if="scope.row.srcListwx"
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.srcListwx" 
                                :preview-src-list="scope.row.srcList1" class="imga">
                            </el-image>
                             <span v-else>暂未上传</span>  
                        </span>    
                        <span  v-else-if="scope.row.buy_type == 2"> 
                            <el-image 
                                 v-if="scope.row.collection_picture"
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.collection_picture" 
                                :preview-src-list="scope.row.collection_pictureList" class="imga">
                            </el-image> 
                            <span v-else>暂未上传</span>   
                        </span>                                  
                    </template>

                </el-table-column>

                <el-table-column label="收款码（支付宝）"  align='center'  width="150" > 

               
                     <template slot-scope="scope" > 

                        <span v-if="scope.row.buy_type == 1"> 
                              <el-image 
                                v-if="scope.row.srcListzfb"
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.srcListzfb" 
                                :preview-src-list="scope.row.srcList2" class="imga">
                             </el-image>
                             <span v-else>暂未上传</span> 
                        </span> 
                        <span v-if="scope.row.buy_type == 2">  
                           <el-image 
                                v-if="scope.row.zfb_collection_picture"
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.zfb_collection_picture" 
                                :preview-src-list="scope.row.zfb_collection_pictureList" class="imga">
                             </el-image>
                            <span v-else>暂未上传</span> 
                        </span>                    
                             
                             
                    </template>
          
                </el-table-column>

                <el-table-column label="收款码（云闪付）"  align='center'  width="150" >               
                     <template slot-scope="scope" > 

                        <span v-if="scope.row.buy_type == 1"> 
                             <el-image v-if="scope.row.srcListysf"
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.srcListysf" 
                                :preview-src-list="scope.row.srcList3" class="imga">
                             </el-image>
                             <span v-else>暂未上传</span>  
                        </span> 
                                                                          
                    </template>
                </el-table-column>

                <el-table-column label="收款码（聚合）"  align='center'  width="150" >               
                     <template slot-scope="scope" > 
                        <span v-if="scope.row.buy_type == 1"> 
                             <el-image v-if="scope.row.srcListjh"
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.srcListjh" 
                                :preview-src-list="scope.row.srcList4" class="imga">
                             </el-image>
                             <span v-else>暂未上传</span>  
                        </span>                                                                          
                    </template>
                </el-table-column>

                 <el-table-column label="收款码（银行卡）"  align='center'  width="150" >               
                     <template slot-scope="scope" > 
                        <span v-if="scope.row.buy_type == 1"> 
                              <el-image v-if="scope.row.srcListyhk"
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.srcListyhk" 
                                :preview-src-list="scope.row.srcList5" class="imga">
                             </el-image>
                             <span v-else>暂未上传</span>
                        </span>                                                                          
                    </template>
                </el-table-column> -->           
                 <el-table-column label="上传凭证"  align='center' >                   
                    <template slot-scope="scope">                   
                           <el-image 
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.voucher_link" 
                                :preview-src-list="scope.row.voucher_linkList" class="imga">
                            </el-image>       
                    </template>
                </el-table-column> 
               <!-- <el-table-column label="兑换方申述原因"  align='center' width="150" >                   
                    <template slot-scope="scope">                   
                        <span  v-if="scope.row.status == 'APPEAL_BUYER || ERROR_FOR_BUYER'">{{ scope.row.reason }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="兑换方申述凭证"  align='center'  width="150" >                   
                    <template slot-scope="scope">                   
                        <span v-if="scope.row.status == 'APPEAL_BUYER || ERROR_FOR_BUYER'">
                             <el-image 
                                style="width: 30px; height: 30px"
                                :src="urlimg + scope.row.reason_picture" 
                                :preview-src-list="scope.row.reason_pictureList" class="imga">
                            </el-image>
                        </span>
                    </template>
                </el-table-column> -->

                 <el-table-column label="操作" align='center' width="150px"  fixed="right">
                    <template slot-scope="scope">
                        <span  v-if="scope.row.status == 'WAIT_ADMIN_EXAMINE'">
                            <el-button size="mini"  type="primary"  plain @click="select_zr_but(scope.row)">责任判定</el-button> 
                        </span>
                    </template>
                </el-table-column>

  
            </el-table>  



              <el-dialog title="选择判定方" :visible.sync="mtk1"  width="400px" >
                <el-form ref="form" :model="mtk1_from"  label-width="100px" style="width:100%;">
                        <el-radio-group v-model="mtk1_from.radio1" size="medium" style="display:flex;" @change="select_change" >
                            <el-radio label="2" border style="flex:1;">出兑方</el-radio>
                            <el-radio label="1" border style="flex:1;">兑换方</el-radio>
                        </el-radio-group>
                        <div style="text-align: center;width:50%;margin:auto;margin-top:20px;">
                        <el-button type="primary" style="width:100%;" class="" @click="select_zr_but_qr" >确认</el-button>
                        </div>
                </el-form>
           </el-dialog> 


   </div>
</template>

<script>

export default {
   name: 'exchangeorderlist',
   props:{
      datalist:{  
        //type:Array,
       default:()=>[]
     },
  },
  data () {
    return {
        dtheight:'500',  //窗口高度
        mtk1:false,
        my_orderno:'',
        mtk1_from:{
           radio1:'1'
        }
    }
  },
   components:{

  },
  created(){
     this.dtheight = window.innerHeight - 300
      
  },
  mounted (){
    
  },
  methods: {
    select_zr_but(row){
        this.my_orderno = row.orderno
         this.mtk1 = true
    },
    select_change(val){
    //   console.log(val)
    },
    select_zr_but_qr(){

        if(this.mtk1_from.radio1 == 1){ //兑换方

            this.post("/trade_kmb/buyReason", {
                orderno:this.my_orderno
                }).then(res => {

                    if(res.error_code == 0){
                        this.open1(res.result,'success')  //提示框
                        this.$emit('up_list_fun')
                        this.mtk1 = false
                        this.my_orderno = ''
                    }else {
                    this.open1(res.message,'warning')
                }

            })

        }else if(this.mtk1_from.radio1 == 2){   //出让方

           this.post("/trade_kmb/saleReason", {
                orderno:this.my_orderno
                }).then(res => {

                    if(res.error_code == 0){
                        this.open1(res.result,'success')  //提示框
                        this.$emit('up_list_fun')
                        this.mtk1 = false
                        this.my_orderno = ''
                    }else {
                    this.open1(res.message,'warning')
                }

            })

        }
    }



  }
}
</script>


<style scoped>
.imga>>>.el-icon-circle-close {
      color: white;
    }
</style>